<div class="bjui-pageContent">
    <form action="/admin/personnel/attendance/rule-set-up" method="post" data-toggle="ajaxform"
          data-options="{
             closeCurrent:true,
          }">
        <input type="hidden" name="is_apply_to_sub_dp" value="0" size="10">
        <div class="bjui-row col-3" style='padding:2%'>
            <div  class='row-label-box row-space' style='display:inline-block;' >
                <div class="row-input " style="width:240px;color: red">
                    <p>保存的修改将从明日起生效</p>
                </div>
            </div>
            <br>
            <div  class='row-label-box row-space' style='display:inline-block' >
                <label class="row-label" style="width:120px;text-align: left;">部门</label>
                <div class="row-input " style="width:240px">
                    @include('admin.widgets.address-list-department', [
                        'multiple' => 'true',
                        'findgrid_department_id' => 'department_ids',
                        'findgrid_department_id_value' => isset($department_ids)?$department_ids:'',
                        'findgrid_address_list_name' => 'name',
                        'findgrid_address_list_value' => isset($name)?$name:'',
                        'on_dialog_close' => 'loadAttendanceRule',
                    ])
                    {{--<input type="hidden" name="department_ids" value="0" size="10">--}}
                </div>
            </div>
            <br>
            {{--<div class='row-label-box row-space' style='display:inline-block'>--}}
                {{--<label class="row-label" style="width:120px;text-align: left;">对子部门应用</label>--}}
                {{--<div class="row-input " style="width:240px">--}}
                    {{--<input type="radio" name="is_apply_to_sub_dp" value="0" checked>否--}}
                    {{--<input type="radio" name="is_apply_to_sub_dp" value="1" >是--}}
                {{--</div>--}}
            {{--</div>--}}
            {{--<br>--}}
            <div class='row-label-box row-space' style='display:inline-block'>
                <label class="row-label" style="width:120px;text-align: left;">周六</label>
                <div class="row-input " style="width:240px">
                    <input type="radio" name="is_sat_workday" value="0" checked>休息
                    <input type="radio" name="is_sat_workday" value="1" @if(isset($is_sat_workday)&&$is_sat_workday==1) checked @endif>上班
                </div>
            </div>
            <br>
            <div class='row-label-box row-space' style='display:inline-block'>
                <label class="row-label" style="width:120px;text-align: left;">打卡距离(米)</label>
                <div class="row-input " style="width:240px">
                    <input type="text" size="10" name="check_in_distance" value="{{$check_in_distance or 1000}}" data-rule="required;number">
                </div>
            </div>
            <br>
            <div class='row-label-box row-space' style='display:inline-block'>
                <label class="row-label" style="width:120px;text-align: left;">早打卡开始</label>
                <div class="row-input " style="width:240px">
                    <input type="text" size="10" name="clock_in_start_time" value="{{$clock_in_start_time_str or '08:00'}}" data-toggle="datepicker" data-pattern="HH:mm" data-rule="required;">
                </div>
            </div>
            <br>
            <div class='row-label-box row-space' style='display:inline-block'>
                <label class="row-label" style="width:120px;text-align: left;">上班时间</label>
                <div class="row-input " style="width:240px">
                    <input type="text" size="10" name="clock_in_time" value="{{$clock_in_time_str or '09:00'}}" data-toggle="datepicker" data-pattern="HH:mm" data-rule="required;">
                </div>
            </div>
            <br>
            <div class='row-label-box row-space' style='display:inline-block'>
                <label class="row-label" style="width:120px;text-align: left;">早打卡旷工</label>
                <div class="row-input " style="width:240px">
                    <input type="text" size="10" name="absence_time" value="{{$absence_time_str or '11:00'}}" data-toggle="datepicker" data-pattern="HH:mm" data-rule="required;">
                </div>
            </div>
            <br>
            <div class='row-label-box row-space' style='display:inline-block'>
                <label class="row-label" style="width:120px;text-align: left;">上班打卡最迟</label>
                <div class="row-input " style="width:240px">
                    <input type="text" size="10" name="clock_in_last_time" value="{{$clock_in_last_time_str or '12:00'}}" data-toggle="datepicker" data-pattern="HH:mm" data-rule="required;">
                </div>
            </div>
            <br>
            <div class='row-label-box row-space' style='display:inline-block'>
                <label class="row-label" style="width:120px;text-align: left;">下班时间</label>
                <div class="row-input " style="width:240px">
                    <input type="text" size="10" name="clock_out_time" value="{{$clock_out_time_str or '17:00'}}" data-toggle="datepicker" data-pattern="HH:mm" data-rule="required;">
                </div>
            </div>
            <br>
            <div class='row-label-box row-space' style='display:inline-block'>
                <label class="row-label" style="width:120px;text-align: left;">下班打卡最迟</label>
                <div class="row-input " style="width:240px">
                    <input type="text" size="10" name="clock_out_last_time" value="{{$clock_out_last_time_str or '21:00'}}" data-toggle="datepicker" data-pattern="HH:mm" data-rule="required;">
                </div>
            </div>
            <br>
            <div class='row-label-box row-space' style='display:inline-block'>
                <label class="row-label" style="width:120px;text-align: left;">特殊工作日</label>
                <div class="row-input div-exception-dates-work" style="width:240px;">
                    <button type="button" class="btn btn-default add-exception-dates-work" data-icon="plus" onclick="appendDivExceptionDatesWork(this)">添加</button><br>
                </div>
            </div>
            <br>
            <div class='row-label-box row-space' style='display:inline-block'>
                <label class="row-label" style="width:120px;text-align: left;">特殊休息日</label>
                <div class="row-input div-exception-dates-work" style="width:240px;">
                    <button type="button" class="btn btn-default add-exception-dates-not-work" data-icon="plus" onclick="appendDivExceptionDatesNotWork(this)">添加</button><br>
                </div>
            </div>
            <br>
            <div class = 'div-exception-dates-work-list'>
                <label class="row-label" style="width:120px;text-align: left;">已设置工作日:</label>
                <br>
                <table class="table table-bordered table-hover" style="width:80%;font-size: 14px;letter-spacing: 1px">
                    <tr>
                        <th>时间</th>
                        <th colspan="2">部门</th>
                        <th>操作</th>
                    </tr>
                    @if(isset($exception_dates_work))
                        @foreach($exception_dates_work as $data)
                            <tr>
                                <td>{{$data['time']}}</td>
                                <td colspan="2">{{$data['oa_department_names']}}</td>
                                <td><button type="button" class="btn btn-default" onclick="deleteAttendanceExceptionDate('{{$data['ids']}}')">删除</button></td>
                            </tr>
                        @endforeach
                    @endif
                </table>
            </div>
            <div class = 'div-exception-dates-not-work-list'>
                <label class="row-label" style="width:120px;text-align: left;">已设置休息日:</label>
                <br>
                <table class="table table-bordered table-hover" style="width:80%;font-size: 14px;letter-spacing: 1px">
                    <tr>
                        <th>时间</th>
                        <th colspan="2">部门</th>
                        <th>操作</th>
                    </tr>
                    @if(isset($exception_dates_not_work))
                        @foreach($exception_dates_not_work as $data)
                            <tr>
                                <td>{{$data['time']}}</td>
                                <td colspan="2">{{$data['oa_department_names']}}</td>
                                <td><button type="button" class="btn btn-default" onclick="deleteAttendanceExceptionDate('{{$data['ids']}}')">删除</button></td>
                            </tr>
                        @endforeach
                    @endif
                </table>
            </div>
        </div>
    </form>
</div>
<div class="bjui-pageFooter">
    <ul>
        <li>
            <button type="button" class="btn-close" data-icon="close">取消</button>
        </li>
        <li>
            <button type="submit" class="btn-default" data-icon="save">保存</button>
        </li>
    </ul>
</div>
<script>
    function loadAttendanceRule()
    {
        var dpIds = $.CurrentNavtab.find('input[name=department_ids]').val();
        if (dpIds === '' || dpIds === 0) return;
        BJUI.ajax('doajax', {
            url: '/admin/personnel/attendance/rule-check',
            data: {
                department_ids:dpIds,
            },
            loadingmask:true,
            okCallback: function(data, options) {
                if (data.is_default === '1') {
                    return;
                }
                $.CurrentNavtab.find('input[name=check_in_distance]').val(data.check_in_distance);
                $.CurrentNavtab.find('input[name=clock_in_start_time]').val(data.clock_in_start_time_str);
                $.CurrentNavtab.find('input[name=clock_in_time]').val(data.clock_in_time_str);
                $.CurrentNavtab.find('input[name=absence_time]').val(data.absence_time_str);
                $.CurrentNavtab.find('input[name=clock_in_last_time]').val(data.clock_in_last_time_str);
                $.CurrentNavtab.find('input[name=clock_out_time]').val(data.clock_out_time_str);
                $.CurrentNavtab.find('input[name=clock_out_last_time]').val(data.clock_out_last_time_str);
                $.CurrentNavtab.find('input[name=is_sat_workday][value=' + data.is_sat_workday + ']').click();
                var dates = data.exception_dates_work;
                var tbody = $.CurrentNavtab.find('div.div-exception-dates-work-list table tbody');
                tbody.html('                    <tr>\n' +
                    '                        <th>时间</th>\n' +
                    '                        <th colspan="2">部门</th>\n' +
                    '                        <th>操作</th>\n' +
                    '                    </tr>');
                for (var i = 0; i < dates.length; i++) {
                    tbody.append('                    <tr>\n' +
                        '                        <td>'+dates[i].time+'</td>\n' +
                        '                        <td colspan="2">'+dates[i].oa_department_names+'</td>\n' +
                        '                        <td><button type="button" class="btn btn-default" onclick="deleteAttendanceExceptionDate(\''+dates[i].ids+'\')">删除</button></td>\n' +
                        '                    </tr>')
                }
                dates = data.exception_dates_not_work;
                tbody = $.CurrentNavtab.find('div.div-exception-dates-not-work-list table tbody');
                tbody.html('                    <tr>\n' +
                    '                        <th>时间</th>\n' +
                    '                        <th colspan="2">部门</th>\n' +
                    '                        <th>操作</th>\n' +
                    '                    </tr>');
                for (var i = 0; i < dates.length; i++) {
                    tbody.append('                    <tr>\n' +
                        '                        <td>'+dates[i].time+'</td>\n' +
                        '                        <td colspan="2">'+dates[i].oa_department_names+'</td>\n' +
                        '                        <td><button type="button" class="btn btn-default" onclick="deleteAttendanceExceptionDate(\''+dates[i].ids+'\')">删除</button></td>\n' +
                        '                    </tr>')
                }
            },
        });
    }

    function deleteAttendanceExceptionDate(ids)
    {
        BJUI.ajax('doajax', {
            url: '/admin/personnel/attendance/delete-exception-date',
            data: {
                ids:ids,
            },
            loadingmask:true,
            okCallback: function(data, options) {
                // BJUI.alertmsg('success', '删除成功');
                BJUI.navtab('reload', {
                    loadingmask:true,
                    data:{
                        department_ids:$.CurrentNavtab.find('input[name=department_ids]').val(),
                        name:$.CurrentNavtab.find('input[name=name]').val(),
                    },
                });
            }
        });
    }

    function appendDivExceptionDatesWork(btn)
    {
        $(btn.parentNode).append('                    <div>\n' +
            '                        <input type="text" size="10" name="exception_dates_work[]" value="" data-toggle="datepicker" data-pattern="yyyy-MM-dd" data-rule="required;date">\n' +
            '                        <button type="button" class="btn btn-default" data-icon="times" onclick="this.parentNode.remove()">删除</button><br>\n' +
            '                    </div>');
    }
    function appendDivExceptionDatesNotWork(btn)
    {
        $(btn.parentNode).append('                    <div>\n' +
            '                        <input type="text" size="10" name="exception_dates_not_work[]" value="" data-toggle="datepicker" data-pattern="yyyy-MM-dd" data-rule="required;date">\n' +
            '                        <button type="button" class="btn btn-default" data-icon="times" onclick="this.parentNode.remove()">删除</button><br>\n' +
            '                    </div>');
    }
</script>
